<template>
	<div id="container">
		<div class="row mb-3">
		  <div class="col-md-6">
		    <label for="taskNumber" class="form-label">任务编号:</label>
		    <input type="search" class="form-control" v-model="psInspectiontaskMain.inspectiontaskcode" id="taskNumber" placeholder="">
		  </div>
		  <div class="col-md-6">
		    <label for="lineNumber" class="form-label">任务名称:</label>
		    <input type="search" class="form-control" id="lineNumber" v-model="psInspectiontaskMain.inspectiontaskname" placeholder="">
		  </div>
		</div>
		<div class="row mb-3">
		  <div class="col-md-6">
		    <label for="inspectionRoute" class="form-label">巡检线路:</label>
		    <select class="form-control" @change="chagneGet()" v-model="selectedLineId">
		      <option value="-1" selected>--请选择--</option>
		      <option v-for="item in LineInfo" :value="item.id" :key="item.id"   >{{ item.linename }}</option>
		    </select>
		  </div>
		  <div class="col-md-6">
		    <label for="inspectors" class="form-label">巡检员:</label><span style="text-decoration: line-through;color: red;"><a href="#" style="color: red;" @click="showModal">-点击选择-</a></span>
		    <textarea class="form-control" v-model="value" rows="3" id="inspectors"></textarea>
			    <el-dialog
			      title="选择巡检员"
			      :visible.sync="modalVisible"
			      width="50%"
			      :before-close="handleClose"
			    >
			      <el-transfer
			       v-model="value"
			        :props="{
					  id:'id',
			          key: 'inspectorcode',
			          label: 'inspectorname'
			        }"
					:titles="['待选巡检员', '已选巡检员']"
			        :data="TransferList"
			      >
			      </el-transfer>
			
			      <span slot="footer" class="dialog-footer">
			        <el-button @click="handleClose">取消</el-button>
			        <el-button type="primary" @click="handleSave">保存</el-button>
			      </span>
			    </el-dialog>
		  </div>
		</div>
		<div class="row mb-3">
		  <div class="col-md-6">
		    <label for="startPole" class="form-label">起始杆号:</label>
		    <input type="search" class="form-control" v-model="psInspectiontaskMain.startpolecode" id="startPole" readonly placeholder="">
		  </div>
		  <div class="col-md-6">
		    <label for="endPole" class="form-label">终止杆号:</label>
		    <input type="search" class="form-control" v-model="psInspectiontaskMain.endpolecode" id="endPole" readonly placeholder="">
		  </div>
		</div>
		<div class="row mb-3">
		  <div class="col-md-6">
		    <label for="issuer" class="form-label">下发人:</label>
			<p style="color:orangered;" v-text="psInspectiontaskMain.issuedbyname"></p>
		  </div>
		  <div class="col-md-6">
		    <label for="issueDate" class="form-label">下发日期:</label>
			<p style="color: orangered;" v-text="psInspectiontaskMain.issuedtime"></p>
		  </div>
		</div>
		<div class="row mb-3">
		  <div class="col-md-12">
		    <label for="inspectors" class="form-label">备注:</label>
		    <textarea class="form-control" rows="3" v-model="psInspectiontaskMain.common" id="inspectors"></textarea>
		  </div>
		</div>
		<div class="row mb-3">
		  <div class="col-md-12">
		    <button type="button" class="btn btn-primary me-3" @click="save">保存</button>
		    <button type="button" class="btn btn-secondary" @click="$router.go(-1)">返回</button>
		  </div>
		</div>
	</div>
</template>

<script>
	import {queryByLineInfo,addpsInspectiontaskMain,queryByDetail,addqueryByDetail,updateQueryByDetail,queryListById,updatePsInspectiontaskMain} from '../../config/request.js'
	export default {
		data(){
		    return  {
				psInspectiontaskMain:{// 修改主表 信息 对象
				},
				LineInfo:{},
				value: [], // 双向绑定的值
				TransferList: [], // Transfer 数据源
				modalVisible: false ,// 控制模态框显示隐藏
				selectedLineId: '-1',
				updateQueryByDetail:{},
				updateQueryByDetailObj:{},
				taskid:'',
				iname:'',
				psInspectorDetail:{}, // 巡检员
			}
	},methods:{
		load(){
			queryByLineInfo().then(json=>{
				this.LineInfo=json.data.queryByLineInfo
			})
			
		},
		save(){
			// 修改
			console.log(this.psInspectiontaskMain)
			if(this.value!=null && this.value!=''){
				console.log(this.psInspectiontaskMain)
				this.psInspectiontaskMain.taskstatus=2
				this.psInspectiontaskMain.taskstatusname="已分配"
				// 修改主表信息
				updatePsInspectiontaskMain(this.psInspectiontaskMain).then(json=>{
					alert(json.message)
					// 修改 巡检员
					this.updateQueryByDetail.forEach(item=>{
					this.updateQueryByDetailObj.taskid=this.psInspectiontaskMain.inspectiontaskcode
					this.updateQueryByDetailObj.id=item.id
					updateQueryByDetail(this.updateQueryByDetailObj).then(json=>{
						
					}) // 延迟一秒后执行销毁操作
				    setTimeout(() => {
				        this.$destroy(); // 销毁组件实例
				    }, 1000); // 延迟 1000 毫秒（即 1 秒）
				})
				})
				
				
				
				
			}else{
				alert("请选择巡检员！")
			}
		},
		chagneGet(){
			if(this.selectedLineId!='-1'){
				 const selectedLine = this.LineInfo.find(item => item.id === this.selectedLineId);
			      console.log(selectedLine); // 输出选中的线路对象
				  this.psInspectiontaskMain.lineid=selectedLine.id
				  this.psInspectiontaskMain.linecode=selectedLine.linecode
				  this.psInspectiontaskMain.linename=selectedLine.linename
				  this.psInspectiontaskMain.startpole=selectedLine.startpole  
				  this.psInspectiontaskMain.startpolecode=selectedLine.startpolecode
				  this.psInspectiontaskMain.endpole=selectedLine.endpole  
				  this.psInspectiontaskMain.endpolecode=selectedLine.endpolecode
			}else{
				this.psInspectiontaskMain.lineid=''
				this.psInspectiontaskMain.linecode=''
				this.psInspectiontaskMain.linename=''
				this.psInspectiontaskMain.startpole='' 
				this.psInspectiontaskMain.startpolecode=''
				this.psInspectiontaskMain.endpole=''
				this.psInspectiontaskMain.endpolecode=''
			}
		},
		  showModal() {
			
			queryByDetail().then(json=>{
				this.TransferList=json.data.queryByDetail
			})
			  // 模态框
			this.modalVisible = true;
		},
		handleClose(done) {
			// 模态框
			// 可以在这里进行取消操作
			this.modalVisible = false;
			done(); // 关闭模态框
		},
		handleSave() {
			console.log(this.value)
			if(this.value!=null && this.value!=''){
				// 保存 transfer  的信息
			// 处理保存逻辑
			    // 获取所选的 value 和 desc
			    const selectedItems = this.TransferList.filter(item => this.value.includes(item.inspectorcode));
			    console.log('保存选择的内容:', selectedItems);
				
				 // 将选中的巡检员信息添加到数组中
				    const selectedInspectors = [];
				    selectedItems.forEach(item => {
						this.iname+=item.inspectorname+','
				        const inspector = {
							id:item.id,
				            inspectorcode: item.inspectorcode,
				            inspectorname: item.inspectorname
				        };
				        selectedInspectors.push(inspector);
				    });
				
					
				    // 将选中的巡检员信息赋给 updateQueryByDetail 对象
				    this.updateQueryByDetail = selectedInspectors;
					this.modalVisible = false; // 关闭模态框
			}else{
				this.iname='';
				
			}			
		}
	    
	},mounted(){
		this.load()
	},created() {
			// 接收参数
			this.psInspectiontaskMain = this.$route.query.obj; //主表任务
			this.selectedLineId=this.psInspectiontaskMain.lineid
			console.log(this.psInspectiontaskMain)
	}
}
</script>

<style scoped>
#container {
	background-color: #DCDFE6;
	border-radius: 5px;
	margin-top: 5%;
	padding: 20px;
}
</style>